import { DeleteProject, GetProjectById, ListProjects } from "@/api/projects"; import { PrimaryButton } from "@/components/Button"; import MainLayout from "@/components/MainLayout"; import Head from "next/head"; import { useRouter } from "next/router"; import { useEffect, useState } from "react"; const ProjectDeletePage = () => { const router = useRouter(); const { id } = router.query; const [project, setProject] = useState(); const [apiResponse, setApiResponse] = useState(); useEffect(() => { GetProjectById(id ? id.toString() : "", setProject); }, [id]); function deleteProject() { let project = { ID: id ? id.toString() : "" }; DeleteProject(project, setApiResponse); } useEffect(() => { apiResponse && apiResponse.status === "OK" && router.push("/projects"); }, [apiResponse]); return ( Delete Project | Watchman

{project?.data?.name && (

{project.data.name}

)}

{project && project.data && project.data.name && (

Are you sure you want to delete this {project.data.name} project?

)}

deleteProject()} /> router.push("/projects")} />

); }; export default ProjectDeletePage;